<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>京东(JD.COM)-商品选购</title>
    <link rel="stylesheet" href="../css/comment.css">
    <link rel="stylesheet" href="../css/index.css">
    <link rel="stylesheet" href="../css/seckill.css">
    <link rel="stylesheet" href="../css/shops.css">
    <link rel="stylesheet" href="../js/shops.js">
    <link rel="shortcut icon" type="image/x-icon" href="../images/小图标/京东.png" />
    <script src="../js/jquery.js"></script>
   
  
</head>

<body>
    <!-- 导航栏 -->
    <nav class="wrap">

        <div class="icon">

            <img src="../images/小图标/房子.png" alt="">
            <a href="index.html">京东首页</a>

            <img src="../images/小图标/地址.png" alt="">

        </div>
        <div class="city">

            <span>广东</span>

            <div class="citys">
                <ul>
                    <li>北京</li>
                    <li>上海</li>
                    <li>天津</li>
                    <li>重庆</li>
                    <li>河北</li>
                    <li>山西</li>
                    <li>河南</li>
                    <li>吉林</li>
                    <li>辽宁</li>
                    <li>黑龙江</li>
                    <li>内蒙古</li>
                    <li>江苏</li>
                    <li>山东</li>
                    <li>安徽</li>
                    <li>浙江</li>
                    <li>福建</li>
                    <li>湖北</li>
                    <li>湖南</li>
                    <li>广东</li>
                    <li>广西</li>
                    <li>江西</li>
                    <li>四川</li>
                    <li>海南</li>
                    <li>云南</li>
                    <li>贵州</li>
                    <li>西藏</li>
                    <li>陕西</li>
                    <li>青海</li>
                    <li>甘肃</li>
                    <li>宁夏</li>
                    <li>新疆</li>
                    <li>港澳</li>
                    <li>台湾</li>
                    <li>钓鱼岛</li>
                    <li>海外</li>
                </ul>

                <dl>
                    <dt>地区专享版本</dt>
                    <dd>中國港澳</dd>
                    <dd>中國台灣</dd>
                    <dd>京东全球</dd>
                </dl>

                <dl class="global">
                    <dt>Availiable Sites</dt>
                    <dd>Global Sites</dd>
                    <dd>Сайт России</dd>
                    <dd>Situs Indonesia</dd>
                    <dd>Sitio de España</dd>
                    <dd>เว็บไซต์ประเทศไทย</dd>
                </dl>

            </div>

        </div>

        <ul class="lists">
            <li><a href="">你好 , 请登录 ...</a></li>
            <li class="spacer"></li>

            <li><a href="">免费注册 </a></li>
            <li class="spacer"></li>

            <li><a href="">我的订单</a></li>
            <li class="spacer"></li>

            <li><a href="">我的京东</a></li>
            <li class="spacer"></li>

            <li><a href="">京东会员</a></li>
            <li class="spacer"></li>

            <li><a href="">企业采购</a></li>
            <li class="spacer"></li>

            <li><a href="">客服服务</a></li>
            <li class="spacer"></li>

            <li><a href="">网站导航</a></li>
            <li class="spacer"></li>

            <li><a href="">手机京东</a></li>

            <div class="myjd">
                <ul>
                    <li><a href="">待处理订单</a></li>
                    <li><a href="">我的问答</a> </li>
                    <li><a href="">返修退换货</a> </li>
                    <li><a href="">我的关注</a> </li>
                    <li><a href="">降价商品</a> </li>
                </ul>
                <ul>
                    <li><a href="">我的京东</a> </li>
                    <li><a href="">我的优惠卷</a> </li>
                    <li><a href="">我的白条</a> </li>
                    <li><a href="">我的理财</a> </li>
                </ul>
            </div>
            <div class="qiye">
                <ul>
                    <li><a href="">企业购</a> </li>
                    <li><a href="">商用场景馆</a> </li>
                    <li><a href="">工业品</a> </li>
                    <li><a href="">丰客多商城</a> </li>
                    <li><a href="">礼品卡</a></li>
                    <li><a href="">微信企业购</a> </li>
                    <li><a href="">工品优选京东锦礼</a> </li>
                    <li><a href="">大中型企业采购</a> </li>
                </ul>
            </div>
            <div class="server">
                <dl>
                    <dt>客户</dt>
                    <dd><a href="">帮助中心</a></dd>
                    <dd><a href="">在线客服</a> </dd>
                    <dd><a href="">意见建议</a> </dd>
                    <dd><a href="">电话客服</a> </dd>
                    <dd><a href="">客服邮箱</a> </dd>
                    <dd><a href="">金融咨询</a> </dd>
                    <dd><a href="">全球客服</a></dd>
                    <dd><a href="">企业客服</a> </dd>

                    <dt> 商户</dt>
                    <dd><a href="">合作企业</a> </dd>
                    <dd><a href="">成长中心</a> </dd>
                    <dd><a href="">商家后台</a> </dd>
                    <dd><a href="">商家帮助</a> </dd>
                    <dd><a href="">规则平台</a> </dd>
                </dl>
            </div>
            <div class="guide">
                <dl>
                    <dt>特色主题</dt>
                    <dd><a href=""> 新品首发</a></dd>
                    <dd><a href="">京东金融</a></dd>
                    <dd><a href="">全球售</a></dd>
                    <dd><a href="">国际站</a></dd>
                    <dd><a href="">京东会员</a></dd>
                    <dd><a href="">台湾售</a></dd>
                    <dd><a href="">俄语站</a></dd>
                    <dd><a href="">装机大师</a></dd>
                    <dd><a href="">港澳售</a></dd>
                    <dd><a href="">优惠价</a></dd>
                    <dd><a href="">秒杀</a></dd>
                    <dd><a href="">闪购</a></dd>
                    <dd><a href="">印尼站</a></dd>
                    <dd><a href="">陪伴计划</a></dd>
                    <dd><a href="">出海招商</a></dd>
                    <dd><a href="">拍拍二手</a></dd>
                    <dd><a href="">买什么</a></dd>
                </dl>
                <dl>
                    <dt>行业频道</dt>
                    <dd><a href="">手机</a> </dd>
                    <dd><a href="">智能数码</a> </dd>
                    <dd><a href="">电脑办公</a> </dd>
                    <dd><a href="">家用电器</a> </dd>
                    <dd><a href="">京东小家</a> </dd>
                    <dd><a href="">京东服务</a> </dd>
                    <dd><a href="">京东生鲜</a> </dd>
                    <dd><a href="">京东服饰</a> </dd>
                    <dd><a href="">家装城</a> </dd>
                    <dd><a href="">母婴</a> </dd>
                    <dd><a href="">食品</a> </dd>
                    <dd><a href="">农资频道</a> </dd>
                    <dd><a href="">整车</a> </dd>
                    <dd><a href="">图书</a> </dd>
                    <dd><a href="">劳动防护</a> </dd>
                </dl>
                <dl>
                    <dt>生活服务</dt>
                    <dd><a href="">京东众筹</a> </dd>
                    <dd><a href="">白条</a> </dd>
                    <dd><a href="">京东App</a> </dd>
                    <dd><a href=""> 京东小金库</a></dd>
                    <dd><a href=""> 理财</a></dd>
                    <dd><a href="">花费</a> </dd>
                    <dd><a href="">水电煤</a> </dd>
                    <dd><a href="">彩票</a> </dd>
                    <dd><a href="">旅行</a> </dd>
                    <dd><a href="">机票酒店</a> </dd>
                    <dd><a href="">电影票</a> </dd>
                    <dd><a href="">京东到家</a> </dd>
                    <dd><a href="">游戏</a> </dd>
                    <dd><a href="">拍拍回收</a> </dd>
                </dl>
                <dl>
                    <dt>更多精选</dt>
                    <dd><a href="">合作招商</a> </dd>
                    <dd><a href="">京东通信</a> </dd>
                    <dd><a href="">京东E卡</a> </dd>
                    <dd><a href="">企业采购</a> </dd>
                    <dd><a href="">服务市场</a> </dd>
                    <dd><a href="">办公生活馆</a> </dd>
                    <dd><a href="">校园加盟</a> </dd>
                    <dd><a href="">京东社区</a> </dd>
                    <dd><a href="">游戏社区</a> </dd>
                    <dd><a href="">知识产权关于我们</a> </dd>


                </dl>
            </div>
        </ul>
    </nav>


    <!-- 搜索栏 -->
    <header class="wrap">

        <div class="categorys">
            <div class="jdpic-left">

            </div>
            <div class="cate-list">
                <div class="all-sec">
                    <a href="">全部分类</a>
                </div>
                <div class="categorys-items">
                    <ul>
                        <li><a href="">家用电器</a></li>
                        <li><a href="">数码</a> </li>
                        <li><a href="">手机</a> </li>
                        <li><a href="">电脑</a> </li>
                        <li><a href="">办公</a> </li>
                    </ul>
                    <ul>
                        <li><a href="">家具</a> </li>
                        <li><a href="">女装</a> </li>
                        <li><a href="">男装</a> </li>
                        <li><a href="">童装</a> </li>
                    </ul>
                </div>
            </div>

        </div>
        <div class="search-sec">
            <input type="text" placeholder=''>
            <button>搜索</button>
        </div>
        <div class="shopingcar-sec">
            <a href="cart.html">🛒我的购物车</a>
        </div>

    </header>




    <div class="shops-box wrap">

        <div class="exzoom" id="exzoom"> 
            <!--大图区域-->
            <div class="exzoom_img_box">
          <ul class='exzoom_img_ul'>
                <li><img src="../images/img/fulinmeng.jpg"/></li>
                <li><img src="../images/img/fulinmeng.jpg"/></li>
                <li><img src="../images/img/fulinmeng.jpg"/></li>
                <li><img src="../images/img/fulinmeng.jpg"/></li>
                <li><img src="../images/img/fulinmeng.jpg"/></li>
                <li><img src="../images/img/fulinmeng.jpg"/></li>
                <li><img src="../images/img/fulinmeng.jpg"/></li>
               
              </ul>
        </div>
            <!--缩略图导航-->
            <div class="exzoom_nav"></div>
            <!--控制按钮-->
            <p class="exzoom_btn"> <a href="javascript:void(0);" class="exzoom_prev_btn"> &lt; </a> <a href="javascript:void(0);" class="exzoom_next_btn"> &gt; </a> </p>
          </div>

        <div class="shops-detail">
            <div class="de-top">
                福临门 东北大米 优质大米 中粮出品
            </div>
            <div class="de-price-wrap">
                <div class="de-price">
                    <span class="jd-price">京东价</span>
    
                    <span class="de-symbol"> ￥ </span>
                    <span class="de-tag">29.8</span>
                </div>
                <div class="de-price">
                    <span class="youhui-price">优惠券</span>
    
                    <span class="de-youhui"><a href=""> 每满300减20</a> </span>
                   
                </div>
                <div class="de-price">
                    <span class="cuxiao">促销</span>
    
                    <span class="cuxiao-symbol"> 限购 </span>
                    <span class="cuxiao-tag">购买不超过200件时享受单件价￥29.8，超出数量以结算价为准</span>
                </div>
                <div class="de-price">
                    <span class="stock">库存</span>
    
                    <span class="stock-st">有货</span>
                   
                </div>
            </div>
            <div class="de-address">
                <span class="de-add-to">配送至</span>
                <span class="city"><span id="selectbox1" class="selectbox"></span></span>
            </div>
            <div class="de-choice">
                <span class="lb">选择类别</span>
                <div class="de-lb">
                    <ul>
                        <li><a href="javascript:0;"><img src="../images/img/福临门大米.png" alt=""><span>福临门200g*1袋</span></a></li>
                        <li><a href="javascript:0;"><img src="../images/img/福临门大米.png" alt=""><span>福临门200g*2袋</span></a></li>
                        <li><a href="javascript:0;"><img src="../images/img/福临门大米.png" alt=""><span>福临门200g*3袋</span></a></li>
                        <li><a href="javascript:0;"><img src="../images/img/福临门大米.png" alt=""><span>福临门200g*4袋</span></a></li>
                        <li><a href="javascript:0;"><img src="../images/img/福临门大米.png" alt=""><span>福临门200g*5袋</span></a></li>
                       
                       
                    </ul>
                </div>
            </div>
            
            <div class="add-to-cart">
                <ul id="list">

                    <li>

                       

                        <strong>1</strong>
                        <input class="btn" type="button" value="-" onclick="fn();" />

                        <input class="btn" type="button" value="+" onclick="gn();" />
                        <span><a href="../html/cart.html"><input type="button" value="加入购物车" onclick=" handleMessage();hn();"></a></span>
                        </li>
                </ul>
            </div>
            <div class="message" id="message"></div>
        </div>

       <aside class="content">
           <p>看了又看</p>
           <ul>
               <li><img src="../images/img/fulinmeng.jpg" alt=""></li>
               <span>￥23.8</span>
               <li><img src="../images/img/aside02.jpg" alt=""></li>
               <span>￥43.8</span>
               <li><img src="../images/img/aside03.jpg" alt=""></li>
               <span>￥42.7</span>
           </ul>
       </aside>
    </div>

    <div class="mid wrap">
        <div class="mid-left">
            <ul>
                <span>店内分类</span>
                <li><a href="javascript:0;">零嘴小食</a></li>
                <li><a href="javascript:0;">调味品</a></li>
                <li><a href="javascript:0;">牛奶 饮品</a></li>
                <li><a href="javascript:0;">居家美食</a></li>
                <li><a href="javascript:0;">品牌</a></li>
                <li><a href="javascript:0;">产品分类</a></li>
                <li><a href="javascript:0;">产品分类</a></li>
                <li><a href="javascript:0;">产品分类</a></li>
                <li><a href="javascript:0;">产品分类</a></li>
                <li><a href="javascript:0;">产品分类</a></li>
                <li><a href="javascript:0;">产品分类</a></li>
                <li><a href="javascript:0;">产品分类</a></li>
            </ul>
        </div>
       
          <div class="mid-right">
            <aside id="tab">
                <nav>
                    <!-- 导航标签 -->
                    <ul >
                        <li><a href="javascript:void 0;">商品介绍</a></li>
                        <li class='active'><a href="javascript:void 0;">规格与包装</a></li>
                        <li><a href="javascript:void 0;">售后保障</a></li>
                        <li><a href="javascript:void 0">商品评价</a></li>
                    </ul>
                </nav>
                <section>
                    <!-- 内容区 -->
                    <div><img src="../images/img/detail01.jpg" alt=""></div>
                    <div style='display: block;'><img src="../images/img/detail02.jpg" alt=""></div>
                    <div><img src="../images/img/detail03.jpg" alt=""></div>
                    <div><img src="../images/img/detail04.jpg" alt=""></div>
                </section>
            </aside>
      
          </div>
    </div>




 <!-- 商城底部 -->
 <div class="jd-footer wrap ">
    <header class="mod-service wrap">
        <div class="cot-txt wrap">
            <div class="list-box">
                <ul class="mod-service-list">
                    <li class="mod-service-item">
                        <div class="item-cot">
                            <h5 class="mod-duo"></h5>
                            <p class="mod-txt">品类齐全，轻松购物</p>
                        </div>
                    </li>


                </ul>
            </div>
            <div class="list-box">
                <ul class="mod-service-list">
                    <li class="mod-service-item">
                        <div class="item-cot">
                            <h5 class="mod-kuai"></h5>
                            <p class="mod-txt">
                                多仓直发，急速配送
                            </p>
                        </div>
                    </li>


                </ul>
            </div>
            <div class="list-box">
                <ul class="mod-service-list">
                    <li class="mod-service-item">
                        <div class="item-cot">
                            <h5 class="mod-hao"></h5>
                            <p class="mod-txt">正品行货，精致服务</p>
                        </div>
                    </li>


                </ul>
            </div>
            <div class="list-box">
                <ul class="mod-service-list">
                    <li class="mod-service-item">
                        <div class="item-cot">
                            <h5 class="mod-sheng"></h5>
                            <p class="mod-txt">天天低价，畅选无忧</p>
                        </div>
                    </li>


                </ul>
            </div>

        </div>

    </header>
    <div class="mod-nav wrap">
        <div class="mod-nav-list wrap">
            <div class="mod-nav-s wrap">
                <div class="mod-nav-item-list">
                    <h5>购物指南</h5>
                    <ul>
                        <li> <a href="">购物流程</a> </li>
                        <li> <a href="">会员介绍</a> </li>
                        <li> <a href=""> 生活旅行</a> </li>
                        <li><a href="">常见问题</a> </li>
                        <li><a href="">大家电</a> </li>
                        <li> <a href="">联系客服</a></li>
                    </ul>
                </div>
                <div class="mod-nav-item-list">
                    <h5>配送方式</h5>
                    <ul>
                        <li> <a href="">上门自提</a> </li>
                        <li> <a href="">211限时达</a> </li>
                        <li> <a href=""> 配送服务查询</a> </li>
                        <li><a href="">配送费收取标准</a> </li>
                        <li><a href="">海外配送</a> </li>

                    </ul>
                </div>
                <div class="mod-nav-item-list">
                    <h5>支付方式</h5>
                    <ul>
                        <li> <a href="">货到付款</a> </li>
                        <li> <a href="">在线支付</a> </li>
                        <li> <a href=""> 分期付款</a> </li>
                        <li><a href="">公司转账</a> </li>
                    </ul>
                </div>
                <div class="mod-nav-item-list">
                    <h5>售后服务</h5>
                    <ul>
                        <li> <a href="">售后政策</a> </li>
                        <li> <a href="">价格保护</a> </li>
                        <li> <a href=""> 退款说明</a> </li>
                        <li><a href="">返修/退换货</a> </li>
                        <li><a href="">取消订单</a> </li>

                    </ul>
                </div>
                <div class="mod-nav-item-list">
                    <h5>特色服务</h5>
                    <ul>
                        <li> <a href=""></a> </li>
                        <li> <a href="">夺宝岛</a> </li>
                        <li> <a href=""> DIY装机</a> </li>
                        <li><a href="">延时服务</a> </li>
                        <li><a href="">京东E卡</a> </li>
                        <li> <a href="">京东通信</a></li>
                        <li> <a href="">鲸鱼座智能</a></li>
                    </ul>
                </div>
                <div class="mod-nav-item-list">
                    <h5>京东自营覆盖区县</h5>
                    <p>
                        京东已向全国2661个区县提供自营配送服务，
                        支持货到付款、POS机刷卡和售后上门服务。

                    </p>
                    <span><a href="">查看详情</a><i class="demo"></i></span>

                </div>
            </div>

        </div>
    </div>
    <footer class="wrap">
        <div class="mod-copyright wrap">
            <p>
                <a href="">关于我们</a>
                <span>|</span>
                <a href="">联系我们</a>
                <span>|</span>
                <a href="">联系客服</a>
                <span>|</span>
                <a href="">合作招商</a>
                <span>|</span>
                <a href="">商家帮助</a>
                <span>|</span>
                <a href="">营销中心</a>
                <span>|</span>
                <a href="">手机京东</a>
                <span>|</span>
                <a href="">友情链接</a>
                <span>|</span>
                <a href="">销售联盟</a>
                <span>|</span>
                <a href="">京东社区</a>
                <span>|</span>
                <a href="">风险监测</a>
                <span>|</span>
                <a href="">隐私政策</a>
                <span>|</span>
                <a href="">京东公益</a>
                <span>|</span>
                <a href="">English Site</a>
                <span>|</span>
                <a href="">Media & IR</a>


            </p>
            <div class="mod-copyright-cot wrap">
                <div class="mod-copyright-txt">
                    <p>
                        <a href="">京公网安备 &nbsp;11000002000088</a>
                        <span>|</span>
                        <a href="">京ICP备11041704号</a>
                        <span>|</span>
                        <a href="">互联网药品信息服务资格证编号(京)-经营性-2014-0008</a>
                        <span>|</span>

                        <span>新出发京零 字第大120007号</span>
                    </p>
                    <p>
                        <a href="">互联网出版许可证编号新出网证(京)字150号</a>
                        <span>|</span>
                        <a href="">出版物经营许可证</a>
                        <span>|</span>
                        <a href="">网络文化经营许可证京网文[2020]6112-1201号</a>
                        <span>|</span>

                        <span>违法和不良信息举报电话：4006561155</span>
                    </p>
                    <p>
                        <span>消费者维权热线：4006067733</span>
                        <span>|</span>
                        <a href="">经营证照</a>
                        <span>|</span>
                        <span>(京)网械平台备字(2018)第00003号</span>
                        <span>|</span>

                        <a href="">营业执照</a>
                    </p>
                </div>
                <div class="mod-copyright-cut-logo">
                    <p>
                        <a href=""><img src="../images/小图标/Global Citizen.png" alt="">Global Site</a>
                        <span>|</span>
                        <a href=""><img src="../images/小图标/法国.png" alt="">France</a>
                        <span>|</span>
                        <a href=""><img src="../images/小图标/Global Citizen.png" alt="">Global Site</a>
                        <span>|</span>
                        <a href=""><img src="../images/小图标/法国.png" alt="">France</a>
                        <span>|</span>
                        <a href=""><img src="../images/小图标/Global Citizen.png" alt="">Global Site</a>
                        <span>|</span>

                    </p>
                </div>
                <div class="mod-copyright-sli">
                    <p>
                        <span>京东旗下网站：</span>
                        <a href="">京东钱包</a>
                        <span>|</span>
                        <a href="">京东云</a>
                    </p>
                </div>
                <div class='copyright'>
                    Copy &copy; 2004-2021 京东JD.com版权所有
                </div>
            </div>
        </div>
    </footer>

</div>



<script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script> 
<script src="../js/jquery.exzoom.js"></script> 
<script type="text/javascript">
	    $("#exzoom").exzoom({
	        autoPlay: false,
	    });//方法调用，务必在加载完后执行
	</script>



    <script src="../js/shops.js"></script>


</body>

</html>